<template>
    <div>
        <div class="sharw" :style="{height:winHeight+'px'}" v-if="iswx">
        </div>
        <div class="headerTitle">
            <!-- <a @click.stop="gotoBack" class="iconfont icon-back_light"></a> -->
            <span>乐团电影-会员全网VIP免费看</span>
        </div>
        <div class="indexHeader">
            <div class="swiper-container">
                <div class="swiper-wrapper">
                    <div class="swiper-slide">
                        <img src="/static/img/titleimg.jpg" alt="">
                    </div>
                    <div class="swiper-slide">
                        <img src="/static/img/titleimg1.jpg" alt="">
                    </div>
                    <div class="swiper-slide">
                        <img src="/static/img/titleimg2.jpg" alt="">
                    </div>
                </div>
                  <div class="swiper-pagination"></div>
            </div>
    
        </div>
        <ul class="list">
            <li v-for="item in lists">
                <a @click.stop="goto" :val="item.href">
                    <img :src="item.img" alt="">
                    <span>{{item.name}}</span>
                </a>
            </li>
        </ul>
        <a class="bottomBtn" @click.stop="gotoLogin">登录会员,无限制观看</a>
    </div>
</template>

<script>
    import swiper from '../../static/javascript/swiper-3.4.2.min.js'
    import axios from "axios";
    import router from "../router/index"
    export default {
        name: "component_name",
        data() {
            return {
                lists: "",
                winHeight: $(window).innerHeight(),
                iswx: true
            };
        },
        mounted() {
            let that = this
            that.is_weixn();
                     let swiper = new Swiper('.swiper-container', {
                pagination: '.swiper-pagination',
                paginationClickable: true
            });
        },
        created() {
            let that = this;
   
            axios.get("/static/json/json.json").then(function(data) {
                that.lists = data.data;
                // console.log(data.data);
            });
        },
        methods: {
            gotoLogin: function() {
                router.push({
                    path: '/login'
                })
            },
            goto: function(e) {
                let dom = e.currentTarget
                let thisval = $(dom).attr('val')
                router.push({
                    name: 'home',
                    params: {
                        id: thisval
                    }
                })
            },
            is_weixn: function() {
                let that = this
                var ua = navigator.userAgent.toLowerCase();
                if (ua.match(/MicroMessenger/i) == "micromessenger") {
                    // return true;
                    that.iswx = true
                    // console.log("true")
                } else {
                    that.iswx = false
                    // return false;
                    // console.log("false")
                }
            }
        }
    };
</script>

<style lang="css" scoped>
    
</style>